<template>
  <div class="page-container">
    <a-card :bodyStyle="{ padding: '0' }" :bordered="false" style="position: relative">
      <a-tabs v-model:active-key="activeTabkey">
        <a-tab-pane key="1" title="申请详情">
          <ApplyInfo :id="id" v-if="activeTabkey == 1" />
        </a-tab-pane>
        <a-tab-pane key="2" title="操作记录" :id="id">
          <OperateLog :id="id" :type="43" v-if="activeTabkey == 2" />
        </a-tab-pane>
      </a-tabs>
      <a-button
        type="primary"
        class="download"
        @click="download"
        v-if="usePermission('svms:value-added:third-payments:polymerisation:download')"
      >
        下载全部申请附件
      </a-button>
    </a-card>
  </div>
</template>
<script setup name="Detail">
  import ApplyInfo from './apply-info.vue'
  import OperateLog from './operate-log.vue'
  import request from '@/api/axios.config'
  import { onMounted, ref } from 'vue'
  import { useRouter } from 'vue-router'
  import { usePermission } from '@/hooks/usePermission'
  import { thirdServicePolymerInfo } from '@/api/finance/thirdPayment'

  const router = useRouter()
  const id = router.currentRoute.value.params.id
  const tab = router.currentRoute.value.query.tab
  const activeTabkey = ref('1')

  // 下载
  const download = () => {
    request
      .post(
        '/polymer/downloadAllFile',
        {
          id: id,
        },
        {
          responseType: 'blob',
        }
      )
      .then((res) => {
        console.log(res)
        fileDownload(res.data)
      })
  }
  // 文件下载
  const currentDate = ref('')
  const fileDownload = (_res) => {
    thirdServicePolymerInfo({ id: id }).then((res) => {
      console.log(_res)
      const blob = new Blob([_res], { type: 'application/zip' })
      let downloadElement = document.createElement('a')
      let href = window.URL.createObjectURL(blob) //创建下载的链接
      downloadElement.href = href
      const now = new Date()
      const year = now.getFullYear()
      const month = String(now.getMonth() + 1).padStart(2, '0')
      const day = String(now.getDate()).padStart(2, '0')
      currentDate.value = `${year}-${month}-${day}`
      downloadElement.download = res.result.epName + currentDate.value //下载后文件名
      document.body.appendChild(downloadElement)
      downloadElement.click() //点击下载
      document.body.removeChild(downloadElement) //下载完成移除元素
      window.URL.revokeObjectURL(href) //释放掉blob对象
    })
  }

  // mounted 调用接口
  onMounted(() => {
    console.log(id)
    console.log(tab)
    activeTabkey.value = tab
  })
</script>
<style lang="less" scoped>
  .download {
    position: absolute;
    right: 0;
    top: 0;
  }
</style>
